Horizontal Alignment of DBE'?

I and the 2 people I'm working with are very new to DXL, and we are learning as we go. Since I come from a UI background, I've been tasked with learning the layout nuances. I'm having an issue where where I am aligning 2 textbox dbe's, and I can not figure out why the left most textbox is disappearing while the label remains. Does anyone have any insight into why this is happening? I've attached an image for reference.

 

left dbMain
      itemParseEntry = text(dbMain, "Type:", "Enter comma delimited attribute items to auto-select:", 120, 50, false)
      itemParseEntry->"right"->"unattached"

      itemParseEntry2 = text(dbMain, "Type2:", "Enter comma delimited attribute items to auto-select:", 120, 50, false)
      itemParseEntry2->"top"->"aligned"->itemParseEntry
      itemParseEntry2->"left"->"spaced"->itemParseEntry //spaced is a couple pixels wider than "flush"
      itemParseEntry2->"right"->"unattached"

 


bleedsgreen33 - Mon May 11 12:57:53 EDT 2015

Re: Horizontal Alignment of DBE'?
ChrisHardy68 - Mon May 11 18:30:55 EDT 2015

Hi,

Not sure I can an answer the why but i can fix the issue:

DB dbMain 
DBE itemParseEntry 
DBE itemParseEntry2

//left dbMain

    dbMain = create("Change This", styleCentered)
     itemParseEntry = text(dbMain, "Type:", "Enter comma delimited attribute items to auto-select:", 120, 80, false)

        itemParseEntry -> "top"            -> "form"
        itemParseEntry -> "left"           -> "form"
     itemParseEntry -> "right"             -> "unattached"
        itemParseEntry -> "bottom"         -> "form"

      itemParseEntry2 = text(dbMain, "Type2:", "Enter comma delimited attribute items to auto-select:", 120, 50, false)

      itemParseEntry2->"top"->"aligned"->itemParseEntry
      itemParseEntry2->"left"->"spaced"->itemParseEntry //spaced is a couple pixels wider than "flush"
      itemParseEntry2->"right"->"unattached"

        show(dbMain )

"Constrained Placement" can be a bit confusing particularly with horizontal placement. Ofen times it appears that you need a fixed "anchor" element that the next element references to.

If you can a lot of elements placed side by side then consider using frames.

The other option is to use the "Simple Placement" which gives you the option of "below" and beside" which may solve your issue

If you want to position element with larger gaps use "Dummy" elements. For example to move the elements done the UI a little use this:

DB dbMain 
DBE itemParseEntry 
DBE itemParseEntry2
DBE dummyElement

//left dbMain

    dbMain = create("Change This", styleCentered)
        dummyElement = label(dbMain , "")
     itemParseEntry = text(dbMain, "Type:", "Enter comma delimited attribute items to auto-select:", 120, 80, false)
     itemParseEntry2 = text(dbMain, "Type2:", "Enter comma delimited attribute items to auto-select:", 120, 50, false)

        dummyElement    -> "top"           -> "form"


        itemParseEntry -> "top"            -> "spaced" -> dummyElement 
        itemParseEntry -> "left"           -> "form"
     itemParseEntry -> "right"             -> "unattached"
        itemParseEntry -> "bottom"         -> "form"


      itemParseEntry2->"top"->"aligned"->itemParseEntry
      itemParseEntry2->"left"->"spaced"->itemParseEntry //spaced is a couple pixels wider than "flush"
      itemParseEntry2->"right"->"unattached"

        show(dbMain )

Hope that helps